<template>
	<view class="mine">
			<view class="item" >
				<view class="item-r">
					<view class="item-b" @click="goout('确定退出吗？')" v-if="isLogin">
						<view class="b-l">
							<view class="font1 text-truncate">
								退出登录
							</view>
						</view>
						<view class="b-r">
						</view>
					</view>
					<view class="item-b" @click="goout('')" v-else>
						<view class="b-l">
							<view class="font1 text-truncate">
								立即登录
							</view>
						</view>
						<view class="b-r">
						</view>
					</view>
				</view>
			</view>
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isLogin:false
			}
		},
		onLoad() {
			
		},
		onShow() {
			if(uni.getStorageSync('token')){
				this.isLogin = true
			}
		},
		methods: {
			goout(content){
				if(content===''){
					uni.redirectTo({
						url:'/pages/login/login'
					})
				}else{
					uni.showModal({
						title:'提示',
						content,
						success: function (res) {
							if (res.confirm) {
								uni.redirectTo({
									url:'/pages/login/login'
								})
								uni.removeStorageSync('token')
								
							} else if (res.cancel) {
								
							}
						}
					});
				}
				
			}
		}
	}
</script>

<style scoped lang="scss">
	page{
		
	}
	.mine{
		background-color: #f7f7f7;
		height: 100vh;
		padding-top: 30rpx;
		box-sizing: border-box;
		box-sizing: border-box;
		.item{
			width: 100%;
			display: flex;
			background-color: #ffffff;
			// border-bottom: 1rpx solid #ececec;
			.img-l{
				width: 200rpx;height: 200rpx;
				margin-right: 20rpx;
				flex: none;
			}
			.item-r{
				padding:  30rpx 30rpx;
				flex: auto;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				.item-t{
					display: flex;
					justify-content: space-between;
					.t-l{
						font-size: 30rpx;
						font-weight: bold;
						
					}
					.t-r{
						font-size: 26rpx;
						color: #ff0000;
					}
				}
				.item-b{
					line-height: 40rpx;
					display: flex;
					align-items: center;
					color: #666;
				}
				.font1{
					margin-right: 20rpx;
					font-size: 28rpx;
					letter-spacing:2rpx;
					
				}
				.b-l{
					box-sizing: border-box;
					padding-right: 20rpx;
					flex:auto;
				}
				.b-r{
					width: 16rpx;
					height: 16rpx;
					border: 1rpx solid #999;
					transform: rotate(45deg);
					border-bottom: 0;
					border-left: 0;
					flex: none;
				}
			}
		}
	}
	
</style>
